<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Static Surface</title>
  <link rel="shortcut icon" href="http://sennajs.com/images/favicon.ico">

  <!-- Including Senna -->
  <script src="../../build/globals/senna-debug.js"></script>
</head>
<body>
  <div id="header">
    Header foo <a href="foo.html">Foo</a><br>
    Header foo <a href="bar.html">Bar</a>
  </div>
  <div id="content">
     Content foo <a href="index.html">Index</a>
  </div>
  <div id="footer">
    Static content: this part will not change if navigating to a page without this surface. [FOO]
  </div>

  <!-- Initializing Senna -->
  <script>
    'use strict';
    var app = new senna.App();
    app.setBasePath('/examples/static_surface');
    app.addSurfaces(['header', 'content']);
    app.addRoutes([
      {
        path: '/index.html',
        handler: senna.HtmlScreen
      },
      {
        path: '/foo.html',
        handler: senna.HtmlScreen
      },
      {
        path: '/bar.html',
        handler: senna.HtmlScreen
      }
    ]);
  </script>
</body>
</html>
